Skip to main content

Diagnostique

Dans le navigateur vous observerez :

  • Erreur 400 GET sur URL https://URL_API/.well-known/openid-configuration : image.png

Dans les logs Digital OCean :

[cam-portailclients-api] [2025-07-21 19:18:40] [19:18:40 INF] CORS policy execution successful.
[cam-portailclients-api] [2025-07-21 19:18:40] [19:18:40 INF] The request URI matched a server endpoint: Configuration.
[cam-portailclients-api] [2025-07-21 19:18:40] [19:18:40 INF] The response was successfully returned as a JSON document: {
[cam-portailclients-api] [2025-07-21 19:18:40]   "error": "invalid_request",
[cam-portailclients-api] [2025-07-21 19:18:40]   "error_description": "This server only accepts HTTPS requests.",
[cam-portailclients-api] [2025-07-21 19:18:40]   "error_uri": "https://documentation.openiddict.com/errors/ID2083"
[cam-portailclients-api] [2025-07-21 19:18:40] }.
[cam-portailclients-api] [2025-07-21 19:18:40] [19:18:40 INF] Request finished HTTP/1.1 GET http://cam-portail-api-hpaib.ondigitalocean.app/.well-known/openid-configuration - 400 168 application/json;charset=UTF-8 5.4379ms

Résolution

C'est un problème assez classique lors du déploiement d'applications ABP Framework derrière un proxy ou dans des conteneurs. Analysons la situation. L'erreur 400 Bad Request sur l'endpoint /.well-known/openid-configuration est très révélatrice. Ce n'est pas une erreur 404 Not Found (le serveur a trouvé la route) ni 403 Forbidden (pas un problème de droits purs), mais bien une "mauvaise requête". La cause la plus probable est que votre serveur API (backend ABP) ne connaît pas sa propre URL publique.

Explication du problème​

  • Le document de découverte OpenID (openid-configuration) contient une liste d'URLs que le client (votre UI) doit utiliser pour l'authentification (endpoint de token, d'autorisation, etc.).

  • Pour générer ces URLs correctement, le serveur d'identité (intégré à ABP) doit savoir sous quelle URL il est accessible publiquement. Par exemple, il doit générer "issuer": "https://cam-portail-api-hpaib.ondigitalocean.app".

  • Lorsque le serveur reçoit une requête pour ce document, il examine le header Host (cam-portail-api-hpaib.ondigitalocean.app). S'il ne reconnaît pas ce host comme étant le sien (parce qu'il n'est pas configuré pour), il considère que la requête est "mauvaise" et renvoie une erreur 400.

  • L'en-tête de réponse Abp-Tenant-Resolve-Error est également un indice majeur. Il suggère que le framework a eu un problème pour identifier le contexte de la requête (potentiellement lié au tenant, qui est souvent résolu via le nom de domaine).

Solutions​

Vous devez configurer explicitement les URLs publiques dans votre application API et UI.

1. Configuration de l'API (Backend ABP)​

C'est l'étape la plus importante. Vous devez dire à votre application API quelle est son URL publique. Pour un environnement de production, modifiez le fichier appsettings.Production.json de votre projet API. Assurez-vous que les sections App et AuthServer sont correctement configurées :

    {
      "App": {
        "SelfUrl": "https://cam-portail-api-hpaib.ondigitalocean.app",
        "CorsOrigins": "https://cam-portailclients-ui-5orv9.ondigitalocean.app"
      },
      "AuthServer": {
        "Authority": "https://cam-portail-api-hpaib.ondigitalocean.app"
      }
    }

  • App:SelfUrl: C'est l'URL racine de votre API. C'est la valeur la plus critique ici.

  • App:CorsOrigins: Vous avez une politique CORS qui fonctionne (visible avec access-control-allow-origin), mais il est bon de s'assurer qu'elle est bien définie ici. Votre URL UI https://cam-portailclients-ui-5orv9.ondigitalocean.app doit y figurer.

  • AuthServer:Authority: Doit pointer vers l'URL de base de votre serveur d'identité, qui est votre API elle-même.

2. Configuration de l'UI (Frontend Angular/React/etc.)​

Votre application frontend doit également savoir où se trouve l'API. Cette configuration se trouve généralement dans un fichier d'environnement. Pour une application Angular, ce serait src/environments/environment.prod.ts.

    // Exemple pour Angular (environment.prod.ts)
    
    export const environment = {
      production: true,
      application: {
        baseUrl: 'https://cam-portailclients-ui-5orv9.ondigitalocean.app',
        name: 'PortailClients',
      },
      oAuthConfig: {
        issuer: 'https://cam-portail-api-hpaib.ondigitalocean.app', // <-- Très important
        redirectUri: 'https://cam-portailclients-ui-5orv9.ondigitalocean.app',
        clientId: 'PortailClients_App', // Vérifiez votre ClientId
        responseType: 'code',
        scope: 'openid profile email role phone ...', // Mettez les scopes dont vous avez besoin
        requireHttps: true
      },
      apis: {
        default: {
          url: 'https://cam-portail-api-hpaib.ondigitalocean.app', // <-- Très important
          rootNamespace: 'MonApplication.PortailClients',
        },
      },
    };

  • oAuthConfig.issuer: Doit correspondre exactement à l'URL de l'API (App:SelfUrl). C'est cette URL que le frontend utilisera pour construire l'adresse /.well-known/openid-configuration.

  • apis.default.url: L'URL de base pour tous les appels API.

3. Gestion des Headers transférés (Forwarded Headers)​

Puisque votre application est derrière le proxy de DigitalOcean, il est essentiel que votre application ASP.NET Core tienne compte des en-têtes X-Forwarded-For et X-Forwarded-Proto. Sans cela, votre application pensera qu'elle reçoit une requête en http et non en https. Dans le fichier Program.cs (ou Startup.cs pour les anciennes versions) de votre projet API, juste avant app.UseRouting(), ajoutez la configuration pour les en-têtes transférés :

    // Dans Program.cs (.NET 6+)
    
    var app = builder.Build();
    
    // ... autres configurations
    
    // IMPORTANT: A ajouter avant les autres middlewares
    app.UseForwardedHeaders(new ForwardedHeadersOptions
    {
        ForwardedHeaders = ForwardedHeaders.XForwardedFor | ForwardedHeaders.XForwardedProto
    });
    
    app.UseCors(); // Assurez-vous d'avoir une politique CORS configurée
    app.UseAuthentication();
    app.UseAuthorization();
    
    // ...

Plan d'action détaillé​

  • Modifiez appsettings.Production.json dans votre projet API pour définir App:SelfUrl sur https://cam-portail-api-hpaib.ondigitalocean.app.

  • Vérifiez App:CorsOrigins dans ce même fichier et assurez-vous qu'il contient https://cam-portailclients-ui-5orv9.ondigitalocean.app.

  • Modifiez le fichier d'environnement de production de votre UI (environment.prod.ts ou équivalent) pour que issuer et l'URL de l'API pointent vers https://cam-portail-api-hpaib.ondigitalocean.app.

  • (Recommandé) Ajoutez le middleware UseForwardedHeaders dans le Program.cs de votre API.

  • Re-build et redéployez vos deux conteneurs sur DigitalOcean avec ces nouvelles configurations.

  • Videz le cache de votre navigateur ou testez en navigation privée pour éviter les problèmes de cache.

Si après ces modifications le problème persiste, essayez de regarder deux choses :

  • Le corps de la réponse 400 : Ouvrez l'onglet "Response" ou "Aperçu" dans les outils de développement de votre navigateur pour voir si ABP renvoie un message d'erreur JSON détaillé.

  • Les logs du conteneur API sur DigitalOcean. Ils contiendront certainement une exception ou un message d'erreur plus précis qui confirmera la cause du problème.